<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="/pages/common.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>采购计划</title>

<script type="text/javascript">
$(function () {

    //1.初始化Table
    var oTable = new TableInit();
    oTable.Init();

    //2.初始化Button的点击事件
    var oButtonInit = new ButtonInit();
	//初始化提示框的位置：top-center，bottom-left，bottom-right
    toastr.options.positionClass = 'toast-top-center';
    //单击
    $('#tb_departmentsjh').on('click-row.bs.table',function (e, row, element) {
        	$("#id").val(row.staffid);
        	$('#tb_departmentsDetailedjh').bootstrapTable('refresh');
    });
});


var TableInit = function () {
    var oTableInit = new Object();
    //初始化Table
    oTableInit.Init = function () {
        $('#tb_departments').bootstrapTable({
            url: '${pageContext.request.contextPath }/staff/list.do',         //请求后台的URL（*）
            showExport: true, //是否显示导出
            exportDataType: "basic", //basic', 'all', 'selected'.
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 20, 30],      //可供选择的每页的行数（*）
            search: true,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: true,
            showColumns: true,                  //是否显示所有的列
            showRefresh: true,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "staffid",                     //每一行的唯一标识，一般为主键列
            showToggle:true,                    //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true
            }, {
                field: 'staffid',
                title: 'id',
                visible: false,
            }, {
                field: 'staffnumbering',
                title: '采购订单号'
            }, {
                field: 'staffname',
                title: '订单日期'
            }, {
                field: 'passwords',
                title: '供应商'
            }, {
                field: 'sex',
                title: '物料名称'
            }, {
                field: 'phone',
                title: '物料编号'
            }, {
                field: 'factoryid',
                title: '单价'
            }, {
                field: 'departmentid',
                title: '数量'
            }, {
                field: 'departmentid',
                title: '金额'
            }, {
                field: 'departmentid',
                title: '要求到货日期'
            }, {
                field: 'stentertime',
                title: '状态'
            }]
        });
        $('#tb_departments1').bootstrapTable({
            url: '${pageContext.request.contextPath }/staff/list.do',         //请求后台的URL（*）
            showExport: false, //是否显示导出
            exportDataType: "basic", //basic', 'all', 'selected'.
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar1',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 20, 30],       //可供选择的每页的行数（*）
            search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: true,
            showColumns: false,                  //是否显示所有的列
            showRefresh: false,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "staffid",                     //每一行的唯一标识，一般为主键列
            showToggle:false,                    //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true
            }, {
                field: 'staffid',
                title: 'id',
                visible: false,
            }, {
                field: 'staffnumbering',
                title: '车种'
            }, {
                field: 'staffname',
                title: '物料名称'
            }, {
                field: 'passwords',
                title: '物料编号'
            }, {
                field: 'phone',
                title: '订单数量'
            }, {
                field: 'factoryid',
                title: '单价'
            }, {
                field: 'departmentid',
                title: '金额'
            }, {
                field: 'stentertime',
                title: '到货日期'
            }]
        });
        
        
        
        
        $('#tb_departmentsjh').bootstrapTable({
        	url: '${pageContext.request.contextPath }/staff/list.do',         //请求后台的URL（*）
            showExport: false, //是否显示导出
            exportDataType: "basic", //basic', 'all', 'selected'.
            method: 'get',                      //请求方式（*）
            toolbar: '',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParamsDetailed,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 20, 30],        //可供选择的每页的行数（*）
            search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: true,
            showColumns: false,                  //是否显示所有的列
            showRefresh: false,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            height: 300,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "staffid",                     //每一行的唯一标识，一般为主键列
            showToggle:false,                    //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true,
                visible: false,
            }, {
                field: 'staffid',
                title: 'id',
		        /*   隐藏：  visible: false,
		                        显示：visible: true,
                visible属性没有true或者false，是visible,invisible和gone。
                visible：可见的；
                invisible：不可见，但占空间；
                gone：不可见，也不占空间，控件从布局上消失了。 */
                visible: false,
                /* align: 'center',
                width: '100px',
                formatter: function (value, row, index) {
                    
                } */

            }, {
                field: 'staffnumbering',
                title: '采购计划单号'
            }, {
                field: 'departmentid',
                title: '采购计划日期'
            }, {
                field: 'stentertime',
                title: '审批状态'
            }]
        });
        $('#tb_departmentsDetailedjh').bootstrapTable({
            url: '${pageContext.request.contextPath }/staff/list.do',         //请求后台的URL（*）
            showExport: false, //是否显示导出
            exportDataType: "basic", //basic', 'all', 'selected'.
            method: 'get',                      //请求方式（*）
            toolbar: '',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParamsDetailed,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 20, 30],       //可供选择的每页的行数（*）
            search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            strictSearch: true,
            showColumns: false,                  //是否显示所有的列
            showRefresh: false,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            height: 300,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "staffid",                     //每一行的唯一标识，一般为主键列
            showToggle:false,                    //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true,
                visible: false
            }, {
                field: 'staffid',
                title: 'id',
                visible: false,
            }, {
                field: 'staffnumbering',
                title: '采购计划单号'
            }, {
                field: 'staffname',
                title: '物料名称'
            }, {
                field: 'passwords',
                title: '颜色'
            }, {
                field: 'sex',
                title: '生产需求数量'
            }, {
                field: 'phone',
                title: '库存数量'
            }, {
                field: 'factoryid',
                title: '安全库存量'
            }, {
                field: 'departmentid',
                title: '采购计划量'
            }, {
                field: 'stentertime',
                title: '审批状态'
            }]
        });
        
    };

    //得到查询的参数
    oTableInit.queryParams = function (params) {
        var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            limit: params.limit,   //页面大小
            offset: params.offset,  //页码
            staffname:$.trim($('#staffnameTJ').val()), 
    		sex:$.trim($('#sexTJ').val()),  
        };
        return temp;
    };
    return oTableInit;
};


var ButtonInit = function () {
    var oInit = new Object();
    var postdata = {};

    oInit.Init = function () {
        //初始化页面上面的按钮事件
    };

    return oInit;
};

$('#exampleModal').on('show.bs.modal', function (event) {
	var button = $(event.relatedTarget) ;
	var recipient = button.data('whatever') ;
	var modal = $(this)
	modal.find('.modal-title').text('New message to ' + recipient);
	modal.find('.modal-body input').val(recipient);
}); 


function doDelete() {
	var row=$.map($("#tb_departments").bootstrapTable('getSelections'),function(row){
		return row ;
	});
	if (row.length == 0) {
		toastr.warning('请至少选择一条数据!');
	}else{
		var ids="";
		var names="";
		for(var i=0;i<row.length;i++){
			if(i==0 || i=="0"){
				ids+=row[i].staffid;
				names+=row[i].staffname;
			}else{
				ids+=","+row[i].staffid;
				names+=","+row[i].staffname;
			}
		}
		
		//询问框
		Ewin.confirm({ message: "确认要删除选择的数据吗？" }).on(function (e) {
	       if (!e) {
	         return;
	       } 
	    	var url = "${pageContext.request.contextPath }/staff/delete.do";
		    $.post(url, "ids="+ids, function(data) {
				if (data == 1) {
					toastr.success('删除成功');
					setTimeout(function(){  //使用  setTimeout（）方法设定定时2000毫秒
						$('#tb_departments').bootstrapTable('refresh'); 
					},2000);
				} else if (data == 2) {
					toastr.warning('该信息已删除!');
					setTimeout(function(){  //使用  setTimeout（）方法设定定时2000毫秒
						$('#tb_departments').bootstrapTable('refresh'); 
					},2000); 
				} else {
					toastr.error('删除失败');
					setTimeout(function(){  //使用  setTimeout（）方法设定定时2000毫秒
						$('#tb_departments').bootstrapTable('refresh'); 
					},2000);
				}
			}); 
	    }); 
	}
}

	
function selectjh() {
	$("#bt").html("采购计划");
	$('#exampleModal').modal(open);
	//清空表单
	document.getElementById("fm").reset();
}
function doView() {
	//取表格的选中行数据
    var row = $("#tb_departments").bootstrapTable('getSelections');
	if (row.length == 1) {
		/* $("#bt").html("修改框");
		$("#staffid").val(row[0].staffid);
		$("#staffnumbering").val(row[0].staffnumbering);
		$("#staffname").val(row[0].staffname);
		$("#sex").val(row[0].sex);
		$("#phone").val(row[0].phone);
		$("#factoryid").val(row[0].factoryid);
		$("departmentid").val(row[0].departmentid);
		$("#duty").val(row[0].duty);
		$("#rsdate").val(row[0].rsdate);
		$('#exampleModal').modal(open); */
	}else{
		toastr.warning('请选择一条数据!');
	}
}
function save() {
	window.location.href="${pageContext.request.contextPath }/pages/tdd/erp/procurementDingdanList.jsp" 
}
function seach() {
	$('#tb_departments').bootstrapTable('refresh'); 
}
function clearSearch() {
	//清空表单
	document.getElementById("formSearch").reset(); 
}
</script>
<script type="text/javascript">
 $(function () {
	$(".form_datetime").datetimepicker({
	 format: "yyyy-mm-dd",
	 autoclose: true,
	 todayBtn: true,
	 todayHighlight: true,
	 showMeridian: true,
	 pickerPosition: "bottom-left",
	 language: 'zh-CN',//中文，需要引用zh-CN.js包
	 startView: 2,//月视图
	 minView: 2//日期时间选择器所能够提供的最精确的时间选择视图
	 });
 });
</script>
<style type="text/css">
.my-container {
    float: left;
    display: inline-block;
    margin-right:30px;
}

.myLabel-content ,.myText-content,.myBtn-content{
    float: left;
    display: inline-block;
    margin-left: 10px;
}
.myLabel-content,.myText-content input[type='text'],.myBtn-content .btn {
    height: 30px;
    font-size: 12px;
}
.myBtn-content .btn {
    margin-bottom: 10px;
}
</style>
</head>
<body>
	<div class="panel-body" style="padding-bottom:0px;">
         <button id="btn_add" type="button" class="btn btn-default" onclick="save()">
             <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>保存
         </button>
         <button id="btn_edit" type="button" class="btn btn-default" onclick="doView()">
        		 <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
         </button>
         <button id="btn_delete" type="button" class="btn btn-default" onclick="doDelete()">
             <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>删除
         </button>
         
           <!--  隐藏runat="server" -->
         <table id="tab1" class="table table-hover table-striped fixed-table-container">
         	<tr>
         		<td>采购单号</td>
         		<td><input  size="9" id="" name=""/></td>
         		<td>选择日期</td>
         		<td colspan="2">
         		    <input class="form_datetime form-control" type="text" id="arrtimeUpdat" name="arrtime" readonly >
         			<!-- <input id="" name=""/> -->
         		</td>
         		<td>制单人</td>
         		<td><input size="9" id="" name=""/></td>
         	</tr>
         	<tr>
         		<td>供应商</td>
         		<td><input size="9" id="" name=""/></td>
         		<td>采购计划单号</td>
         		<td colspan="2">
         			<select id="scjh" style="width: 88px;height: 30px;" onclick="selectjh()">
         			</select>
         		</td>
         		<td>审批人</td>
         		<td><input size="9" id="" name=""/></td>
         	</tr>
         	<tr>
         		<td colspan="8">
         			<table id="tb_departments1"></table>
         		</td>
         	</tr>
         </table>
    </div>
    
    
    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
		aria-labelledby="detailLabel" aria-hidden="true"
		data-backdrop="static" data-keyboard="false">
		<div class="modal-dialog" style="width: 70%;">
			<div class="modal-content">
    			<div class="modal-header">
        			<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        			<h4 class="modal-title" id="exampleModalLabel">
        				<span id="bt"></span>
        			</h4>
      			</div>
      			<div class="modal-body">
      				<div class="panel panel-default">
			            <div class="panel-heading">查询条件</div>
			            <div class="panel-body">
			                <form id="formSearch" class="form-horizontal">
			                	<div class="form-group" style="margin-top:15px">
			                        <label class="control-label col-sm-1" for="txt_search_departmentname">日期:</label>
			                        <div class="col-sm-1">
			                            <select id="txt_search_departmentname" name="materienumber" class="selectpicker show-tick form-control"  data-live-search="false">
				                         <option>最近一天</option>
				                         <option>最近一星期</option>
				                         <option>最近一个月</option>
			                         </select>
			                        </div>
			                        <label class="control-label col-sm-1" for="txt_search_statu" style="width: 30px;">从</label> 
			                        <div class="col-sm-2" style="width: 236px;/* padding-left: 0px;padding-right: 0px; */">
			                        	<input class="form_datetime form-control" type="text" id="arrtimeUpdat" name="arrtime" readonly >
			                        </div>
			                        <label class="control-label col-sm-1" for="txt_search_statu" style="width: 30px;padding-left: 0px;">至</label> 
			                        <div class="col-sm-2" style="width: 236px;/* padding-left: 0px;padding-right: 0px; */">
			                        	<input class="form_datetime form-control"  type="text" id="arrtimeUpdat" name="arrtime" readonly >
			                        </div>
									<label class="control-label col-sm-1" for="txt_search_departmentname">相关单位:</label>
			                        <div class="col-sm-1">
			                         <select id="txt_search_departme" name="materienumber" class="selectpicker show-tick form-control"  data-live-search="false">
				                         <option>所有客户</option>
				                		 <option>**客户</option>
				                		 <option>@@客户</option>
				                		 <option>……客户</option>
			                         </select>
			                        </div>
			                         <div>
					                	<button type="button" style="margin-left:50px" id="btn_query" class="btn btn-primary" onclick="seach()">查询</button>
					                	<button type="button" style="margin-left:50px" id="clearf" class="btn btn-primary" onclick="clearSearch()">清除</button>
					                 </div>
			                	</div>	
			                </form>
		            </div>
		        </div> 
		        <!-- <div id="toolbar" class="btn-group">
		            <button id="btn_delete" type="button" class="btn btn-default" onclick="doDelete()">
		                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>确定
		            </button>
		        </div>  -->     
		        <table id="tb_departmentsjh"></table>
		        <input type="hidden" id="id">
		        <table id="tb_departmentsDetailedjh"></table>
		        <div class="modal-footer">
					<button type="button" class="btn btn-default" onclick="gb()">关闭</button>
					<script type="text/javascript">
						function gb() {
							$('#exampleModal').modal('hide');
						}
					</script>
				</div>
    		</div>
  		</div>
	</div>
    
	
	<script type="text/javascript">
	$(function() {
		var layerTips = parent.layer === undefined ? layui.layer : parent.layer
		$("#fm").bootstrapValidator({
			feedbackIcons : {
				valid : 'glyphicon glyphicon-ok',
				invalid : 'glyphicon glyphicon-remove',
				validating : 'glyphicon glyphicon-refresh'
			},
			fields : {
				staffnumbering : {
					validators : {
						notEmpty : {
							message : '员工编号不能为空'
						},
					}
				},
				staffname : {
					validators : {
						notEmpty : {
							message : '员工姓名不能为空'
						},
					}
				},
				sex : {
					validators : {
						notEmpty : {
							message : '员工姓名不能为空'
						},
					}
				},
				fax : {
					validators : {
						notEmpty : {
							message : '传真不能为空'
						},
						/* stringLength: {
	                         min: 11,
	                         max: 12,
	                         message: '请输入传真号码'
	                     }, */
	                     regexp: {
	                         regexp:  /0\d{2,3}-\d{7,8}/,
	                         message: '请输入正确的传真号码'
	                     }
					}
				},
				phone : {
					validators : {
						notEmpty : {
							message : '联系电话不能为空'
						},
						/* stringLength: {
	                         min: 11,
	                         max: 11,
	                         message: '请输入联系电话号码'
	                     }, */
	                     regexp: {
	                         regexp:    /^(0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8})|(400|800)([0-9\\-]{7,10})|(([0-9]{4}|[0-9]{3})(-| )?)?([0-9]{7,8})((-| |转)*([0-9]{1,4}))?$/,
	                         message: '请输入正确的联系电话号码'
	                     }
					}
				},
				factoryid : {
					validators : {
						notEmpty : {
							message : '工厂不能为空'
						},
					}
				},
				departmentid : {
					validators : {
						notEmpty : {
							message : '部门不能为空'
						},
					}
				},
				duty : {
					validators : {
						notEmpty : {
							message : '职责不能为空'
						},
					}
				},
				/* rsdate : {
					validators : {
						notEmpty : {
							message : '入社日期不能为空'
						},
						date : {
							format : "yyyy-MM-dd"
						}
					}
				}, */
				
			},
		});
	});
	</script>
	<!-- <script>
	 $(document).ready(function() {
            $('.registerForm').bootstrapValidator({
                fields: {
                	/* staffname: {
                        message: 'The username is not valid',
                        validators: {
                            notEmpty: {
                                message: '不为空'
                            },
                            stringLength: {
                                min: 6,
                                max: 30,
                                message: '6-30位'
                            },
                            regexp: {
                                regexp: /^[a-zA-Z0-9_]+$/,
                                message: '只能由字母、数字和下划线组成'
                            }
                        }
                    }, */
                    staffnumbering : {
                    	message: 'The username is not valid',
    					validators : {
    						notEmpty : {
    							message : '员工编号不能为空'
    						},
    					}
    				},
    				staffname : {
    					validators : {
    						notEmpty : {
    							message : '员工姓名不能为空'
    						},
    					}
    				},
    				sex : {
    					validators : {
    						notEmpty : {
    							message : '员工姓名不能为空'
    						},
    					}
    				},
    				fax : {
    					validators : {
    						notEmpty : {
    							message : '传真不能为空'
    						},
    						/* stringLength: {
    	                         min: 11,
    	                         max: 12,
    	                         message: '请输入传真号码'
    	                     }, */
    	                     regexp: {
    	                         regexp:  /0\d{2,3}-\d{7,8}/,
    	                         message: '请输入正确的传真号码'
    	                     }
    					}
    				},
    				phone : {
    					validators : {
    						notEmpty : {
    							message : '联系电话不能为空'
    						},
    						/* stringLength: {
    	                         min: 11,
    	                         max: 11,
    	                         message: '请输入联系电话号码'
    	                     }, */
    	                     regexp: {
    	                         regexp:    /^(0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8})|(400|800)([0-9\\-]{7,10})|(([0-9]{4}|[0-9]{3})(-| )?)?([0-9]{7,8})((-| |转)*([0-9]{1,4}))?$/,
    	                         message: '请输入正确的联系电话号码'
    	                     }
    					}
    				},
    				factoryid : {
    					validators : {
    						notEmpty : {
    							message : '工厂不能为空'
    						},
    					}
    				},
    				departmentid : {
    					validators : {
    						notEmpty : {
    							message : '部门不能为空'
    						},
    					}
    				},
    				duty : {
    					validators : {
    						notEmpty : {
    							message : '职责不能为空'
    						},
    					}
    				},
    				rsdate : {
    					validators : {
    						notEmpty : {
    							message : '入社日期不能为空'
    						},
    						date : {
    							format : "yyyy-MM-dd"
    						}
    					}
    				},
                }
            });
        });
    </script>  -->
</body>
</html>